<style type="text/css">
.layui-table-cell {
	height: auto;
	line-height: 28px;
}
</style>
<div class="layui-card">
	<div class="layui-card-header">
		<h2 class="header-title">出货订单管理</h2>
		<span class="layui-breadcrumb pull-right"> <a
			href="#!home_console">首页</a> <a><cite>出货订单管理</cite></a>
		</span>
	</div>
	<div class="layui-card-body">
		<div class="layui-form toolbar">
			<div class="layui-form-item">
				<div class="layui-inline">
					<label class="layui-form-label">开始日期：</label>
					<div class="layui-input-inline">
						<input type="text" name="beginDate" id="beginDate"
							autocomplete="off" class="layui-input">
					</div>
				</div>

				<div class="layui-inline">
					<label class="layui-form-label">结束日期：</label>
					<div class="layui-input-inline">
						<input type="text" name="endDate" id="endDate" autocomplete="off"
							class="layui-input">
					</div>
				</div>


				<div class="layui-inline">
					<button id="user-btn-search"
						class="layui-btn layuiadmin-btn-useradmin" lay-submit
						lay-filter="LAY-front-search">
						<i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
					</button>
					<button id="btn-reset" class="layui-btn icon-btn">
						<i class="layui-icon">&#x1006;</i>重置
					</button>
				</div>
			</div>

		</div>
		<table class="layui-table" id="orderSell-table"
			lay-filter="orderSell-table"></table>
	</div>
</div>
<!-- 表格操作列 -->
<script type="text/html" id="orderSell-table-bar">
    <% if(edit) { %> <a class="layui-btn layui-btn-xs" lay-event="edit">订单详情</a> <% } %>
   <% if(confirming) { %> 
        {{#  if(d.orderStatus === 1){ }}
			 <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="cancel">取消订单</a>
             <a class="layui-btn layui-btn-warm layui-btn-xs" lay-event="confirming">确认出货</a>
            {{# } else  { }}  
			<a class="layui-btn layui-btn-disabled layui-btn-xs">取消订单</a>
            <a class="layui-btn layui-btn-disabled layui-btn-xs">确认出货</a>
        {{#  } }}
    <% } %>
</script>
<!-- 表格状态列 -->
<script type="text/html" id="status-tpl-state">
    {{# if (d.orderStatus=== 1) { }}  
        <button class="layui-btn layui-btn-xs">卖方待确认</button>
    {{# } else if(d.orderStatus=== 2) { }}  
        <button class="layui-btn layui-btn-xs layui-btn-normal">卖方已确认</button>
    {{# } else if(d.orderStatus=== 3) { }}  
        <button class="layui-btn layui-btn-xs layui-btn-danger">买方已确认</button>
    {{# } else if(d.orderStatus=== 4) { }}  
        <button class="layui-btn layui-btn-xs layui-btn-danger">卖方已拒绝</button>
	{{# } else if(d.orderStatus=== 5) { }}  
        <button class="layui-btn layui-btn-xs layui-btn-danger">买方已取消</button>
	{{# } else if(d.orderStatus=== 6) { }}  
        <button class="layui-btn layui-btn-xs layui-btn-danger">卖方已取消</button>
    {{# } }}
</script>
<!-- 表格状态列 -->
<script type="text/html" id="delivery-tpl-state">
    {{# if (d.delivery=== 1) { }}  
        <button class="layui-btn layui-btn-danger layui-btn-xs">配送</button>
    {{# } else if(d.delivery=== 2) { }}  
        <button class="layui-btn layui-btn-xs layui-btn-warm">自提</button>
    {{# } }}
</script>
<script>
layui.use(['form', 'table', 'util', 'admin', 'element','laydate'], function() {
    var form = layui.form;
    var table = layui.table;
    var layer = layui.layer;
    var util = layui.util;
    var admin = layui.admin;
    var laydate = layui.laydate;
    var element = layui.element;

    form.render('select');
    
    laydate.render({
        elem: '#beginDate'
    });
    laydate.render({
        elem: '#endDate'
    });

    // 渲染表格

    table.render({
        elem: '#orderSell-table',
        url: 'service/orderSell/list',
        where: { shopId: $("#shopInfo").attr("data") },
        page: true,
        cols: [
            [
                { type: 'numbers',title: '序号' },
                { field: 'orderCode', align: 'center', title: '订单编号' },
                { field: 'userName', align: 'center', title: '采购商' },
                { field: 'userPhone', align: 'center', title: '采购商电话' },
                { field: 'shopName', align: 'center', title: '门店名称' },
                { field: 'totalNum', align: 'center', title: '总数量（件）' },
                { field: 'totalPrice', align: 'center', title: '总价格（元）' },
                { field: 'orderStatus', sort: true, templet: '#status-tpl-state', align: 'center', title: '订单状态' },
                { field: 'delivery', templet: '#delivery-tpl-state', align: 'center', title: '供货方式' },
                {
                    sort: true,
                    align: 'center',
                    templet: function(d) {
                        return util.toDateString(d.createTime);
                    },
                    title: '创建时间'
                },
                { align: 'center', width: 250, toolbar: '#orderSell-table-bar', title: '操作' }
            ]
        ]
    });

    // 添加按钮点击事件
    $('#shop-btn-add').click(function() {
        showEditModel();
    });

    // 工具条点击事件
    table.on('tool(orderSell-table)', function(obj) {
        var data = obj.data;
        var layEvent = obj.event;

        if (layEvent === 'edit') { // 修改
            showEditModel(data);
        } else if (layEvent === 'confirming') { // 确认订单
            layer.confirm('确定要确认此订单么？', function() {
                layer.load(2);
                admin.req("service/orderSell/confirming", {
                    id: obj.data.id
                }, function(data) {
                    layer.closeAll('loading');
                    if (data.code == 1) {
                        layer.msg(data.msg, {
                            icon: 1,
                            time: 1000
                        }, function() {
                            table.reload('orderSell-table', {});
                        })
                    } else {
                        layer.msg(data.msg, {
                            icon: 2,
                            time: 3000
                        }, function() {
                            table.reload('orderSell-table', {});
                        })
                    }
                }, "post");
            });
        }else if (layEvent === 'cancel') { // 取消订单
            layer.confirm('确定要取消该订单么？', function() {
                layer.load(2);
                admin.req("service/orderSell/cancel", {
                	id : obj.data.id,orderStatus : 6
                }, function(data) {
                    layer.closeAll('loading');
                    if (data.code == 1) {
                        layer.msg(data.msg, {
                            icon: 1,
                            time: 1000
                        }, function() {
                            table.reload('orderSell-table', {});
                        })
                    } else {
                        layer.msg(data.msg, {
                            icon: 2,
                            time: 3000
                        }, function() {
                            table.reload('orderSell-table', {});
                        })
                    }
                }, "post");
            });
        }
    });

    // 显示表单弹窗
    var showEditModel = function(data) {
        var title = "订单详情--合计："+data.totalPrice+"元";
        admin.putTempData('t_order', data);
        var str = data ? JSON.stringify(data) : " ";
        admin.popupCenter({
            area: '50%',
            title: title,
            path: "service/orderSell/detailForm?orderId=" + data.orderCode,
            data: { orderId: data.orderCode },
            finish: function() {
                table.reload('orderSell-table', {});
            }
        });
    };

    //监听搜索
    form.on('submit(LAY-front-search)', function(data){
      var field = data.field;
      table.reload('orderSell-table', {where: {beginDate: field.beginDate,endDate:field.endDate}});
    });

    // 修改user状态
    form.on('switch(user-tpl-state)', function(obj) {
        layer.load(2);
        $.post('system/user/updateState', {
            userId: obj.elem.value,
            state: obj.elem.checked ? 0 : 1
        }, function(data) {
            layer.closeAll('loading');
            if (data.code == 200) {
                layer.msg(data.msg, { icon: 1 });
                //table.reload('table-user', {});
            } else {
                layer.msg(data.msg, { icon: 2 });
                $(obj.elem).prop('checked', !obj.elem.checked);
                form.render('checkbox');
            }
        });
    });

    //搜索按钮点击事件
    $('#btn-reset').click(function() {
        location.reload();
    });
});
</script>